<template>
  <div class="box">
    <h2>Son2 子组件</h2>
    从vuex中获取的值: <label>{{ count }}</label>
    <br />
    <button @click="subcount1(1)">值加-1</button>
    <button @click="subcount1(3)">值加-1</button>
    <button @click="subcount1(5)">值加-1</button>
    <button @click="subcount1(10)">值加-1</button>
  </div>
</template>

<script>
import { mapMutations, mapState } from "vuex";
export default {
  name: "Son2Com",
  created() {},
  methods: {
    ...mapMutations(["subcount"]),
    subcount1(n) {
      this.subcount({
        num: n,
      });
    },
  },
  computed: {
    ...mapState(["count"]),
  },
};
</script>

<style lang="css" scoped>
.box {
  border: 3px solid #ccc;
  width: 400px;
  padding: 10px;
  margin: 20px;
}
h2 {
  margin-top: 10px;
}
</style>
